$(function () {
  let mobile = document.querySelector("#mobile-name");
  let password = document.querySelector("#password");
  let confirm = document.querySelector("#confirm");
  let aText = document.querySelectorAll(".text");
  let aWrong = document.querySelectorAll(".wrong");
  let aSucces = document.querySelectorAll(".succes");
  let oAgree = document.querySelector("#agree");
  let oButton = document.querySelector(".register-submit");

  let mobileReg =
    /^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{8}$/;
  let passwordReg = /^\d{6,10}$/;

  mobile.onfocus = function () {
    mobile.style.border = "1px solid #b2b2b2";
    aWrong[0].style.opacity = 0;
    aSucces[0].style.opacity0;
    aText[0].innerText = "";

    mobile.oninput = function () {
      if (mobileReg.test(mobile.value)) {
        aSucces[0].style.opacity = 1;
        aText[0].innerText = "";
        aWrong[0].style.opacity = 0;
      }
    };
    mobile.onblur = function () {
      if (mobile.value == "") {
        aText[0].innerText = "手机号不能为空";
        mobile.style.border = "1px solid #ec5042";
        aWrong[0].style.opacity = 1;
        aSucces[0].style.opacity = 0;
      } else if (mobileReg.test(mobile.value) == false) {
        console.log("456");
        aText[0].innerText = "请输入正确的手机号";
        mobile.style.border = "1px solid #ec5042";
        aWrong[0].style.opacity = 1;
        aSucces[0].style.opacity = 0;
      }
    };
  };
  password.onfocus = function () {
    password.style.border = "1px solid #b2b2b2";

    aText[1].innerText = "";
    aWrong[1].style.opacity = 0;
    aSucces[1].style.opacity = 0;
    password.oninput = function () {
      if (passwordReg.test(password.value)) {
        aSucces[1].style.opacity = 1;
        aText[1].innerText = "";
        aWrong[1].style.opacity = 0;
      }
    };
    password.onblur = function () {
      if (password.value == "") {
        aText[1].innerText = "密码不能为空";
        password.style.border = "1px solid #ec5042";
        aWrong[1].style.opacity = 1;
        aSucces[1].style.opacity = 0;
      } else if (passwordReg.test(password.value) == false) {
        aText[1].innerText = "请输入正确的密码";
        password.style.border = "1px solid #ec5042";
        aWrong[1].style.opacity = 1;
        aSucces[1].style.opacity = 0;
      }
    };
  };
  confirm.onfocus = function () {
    confirm.style.border = "1px solid #b2b2b2";
    aSucces[2].style.opacity = 0;
    aWrong[2].style.opacity = 0;
    aText[2].innerText = "";
    confirm.onblur = function () {
      if (confirm.value == "") {
        aText[2].innerText = "密码不能为空，请重试";
        confirm.style.border = "1px solid #ec5042";
        aWrong[2].style.opacity = 1;
        aSucces[2].style.opacity = 0;
      } else if (confirm.value == password.value) {
        aSucces[2].style.opacity = 1;
        aText[2].innerText = "";
        aWrong[2].style.opacity = 0;
      } else {
        aText[2].innerText = "两次输入的密码不一致，请重试";
        confirm.style.border = "1px solid #ec5042";
        aWrong[2].style.opacity = 1;
        aSucces[2].style.opacity = 0;
      }
    };
  };
  oAgree.onclick = function () {
    if (oAgree.checked) {
      aText[3].innerText = "";
    } else {
      aText[3].innerText = "请阅读并同意服务条款";
    }
  };
  let flag = true;
  oButton.onclick = function () {
    if (mobileReg.test(mobile.value) == false) {
      flag = false;
      aWrong[0].style.opacity = 1;
      aText[0].innerText = "请输入正确的手机号";
    }

    if (passwordReg.test(password.value) == false) {
      flag = false;
      aWrong[1].style.opacity = 1;
      aText[1].innerText = "请输入正确的密码";
    }

    if (confirm.value != password.value) {
      flag = false;
      aWrong[2].style.opacity = 1;
      aText[2].innerText = "两次输入密码不一致";
    }

    if (oAgree.checked == false) {
      flag = false;
      aText[3].innerText = "请阅读并同意服务条款";
    }

    if (flag) {
      axios
        .get("http://jx.xuzhixiang.top/ap/api/reg.php", {
          params: {
            username: mobile.value,
            password: password.value,
          },
        })
        .then(function (res) {
          if (res.data.code == 1) {
            location.assign("../login.html");
          } else {
            alert("注册失败，请重试");
          }
        });
    }
  };
});
